import { Dep } from "./Dep";
import observe from "./observe";

// 定义一个函数，实现对对象的属性的响应式处理
export default function defineReactive(data, key, val) {
  // 闭包中的dep对象: 值为对象中有dep，普通值也有dep
  const dep = new Dep();

  // 如果定义成响应式的时候没有初始化值，则返回对象原来的值
  if ([...arguments].length === 2) {
    val = data[key];
  }

  let childOb = observe(val);

  Object.defineProperty(data, key, {
    enumerable: true,
    configurable: true,
    get() {
      // 如果现在处于依赖收集的阶段，比如说，首次组件渲染的时候， **
      // 我们需要将当前的watcher添加到dep中                  **
      
      if (Dep.target) {
        console.log('****** watcher来拿数据啦');
        dep.depend();
        if (childOb) {
          childOb.dep.depend();
        }
      }
      return val;
    },
    set(newVal) {
      childOb =  observe(newVal);
      if (newVal !== val) {
        val = newVal;
        // 通知更新
        dep.notify();
      }
    },
  });
}
